import React from 'react';
import { 
    Tabs,
    Table,
} from 'antd';
import { COLUMNS_CONF } from './conf';
import moment from 'moment';

function callback(key) {
  console.log(key);
}

let tableData = [
    {
        operatorType: 1, // 操作类型
        operator: '曲丽丽', // 操作人
        result: 1, // 执行结果
        timestamp: 1629029904506, // 操作时间
    },
    {
        operatorType: 2, // 操作类型
        operator: '曲丽丽', // 操作人
        result: 0, // 执行结果
        timestamp: 1629029904506, // 操作时间
    },
    {
        operatorType: 1, // 操作类型
        operator: '曲丽丽', // 操作人
        result: 1, // 执行结果
        timestamp: 1629029904506, // 操作时间
    },
    {
        operatorType: 3, // 操作类型
        operator: '曲丽丽', // 操作人
        result: 1, // 执行结果
        timestamp: 1629029904506, // 操作时间
    },
    {
        operatorType: 3, // 操作类型
        operator: '曲丽丽', // 操作人
        result: 1, // 执行结果
        timestamp: 1629029904506, // 操作时间
    },
];

// 操作类型映射关系
const operatorTypeMapping = {
    '1': '订购关系生效',
    '2': '财务复审',
    '3': '部门初审',
    '4': '提交订单',
    '5': '创建订单',
};

const resultMapping = {
    '0': '驳回',
    '1': '成功',
};

tableData = tableData.map((d, i) => {
    return {
        ...d,
        key: i,
        operatorType: operatorTypeMapping[d.operatorType],
        result: resultMapping[d.result],
        timestamp: moment(d.timestamp).format('YYYY-MM-DD HH:mm:ss'),
    };
});

/**
 * 1. 加key
 * 2. operatorType/result/timestamp映射
 */


export default function () {
    return (
        <Tabs defaultActiveKey="1" onChange={callback}>
            <Tabs.TabPane tab="操作日志1" key="1">
                <Table 
                    dataSource={ tableData } 
                    columns={ COLUMNS_CONF }
                    pagination={ false }
                />
            </Tabs.TabPane>
            <Tabs.TabPane tab="操作日志2" key="2">
                Content of Tab Pane 2
            </Tabs.TabPane>
            <Tabs.TabPane tab="操作日志3" key="3">
                Content of Tab Pane 3
            </Tabs.TabPane>
        </Tabs>
    );
}